<!DOCTYPE html>
<html lang="en"  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>用户端会员报表分析</title>
    <link rel="icon" href="favicon.ico" type="images/ico">
    <meta name="author" content="dc">
    <link rel="stylesheet" type="text/css" href="/css/materialdesignicons.min.css">
    <link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="/css/animate.min.css">
    <link rel="stylesheet" type="text/css" href="/css/style.min.css">
    <link href="/js/bootstrap-table/bootstrap-table.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="/js/jquery-confirm/jquery-confirm.min.css"/>
    <!--固定table列-->
    <link href="/js/bootstrap-table/extensions/fixed-columns/bootstrap-table-fixed-columns.min.css" rel="stylesheet"/>
    <!--时间选择插件-->
    <link rel="stylesheet" href="/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.css"/>
    <!--日期选择插件-->
    <link rel="stylesheet" href="/js/bootstrap-datepicker/bootstrap-datepicker3.min.css"/>
    <!-- 多选下拉 -->
    <link rel="stylesheet" href="/css/bootstrap-select.css" type="text/css"/>
    <link rel="stylesheet" href="/css/skin.css"/>
    <link rel="stylesheet" href="/css/customerManager/user/vipCustomerAnalyse.css"/>
    <link rel="stylesheet" href="/css/statisticsManager/common.css"/>
</head>
<body>
<input type="hidden" id="poolId" name="poolId" th:value="${vo}">
<div class="container-fluid customer-page">
    <div class="card">
        <div class="card-header">
            <h1>会员分析</h1>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="analy-entire" style="height: 450px">
                        <div class="customer-rate"><p>会员报表分析</p> </div>
                        <div style="width: 100%;height: 400px;" id="memberChart"></div>
                    </div>

                </div>
                <div class="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12 analy-entire" style="padding: 0;">
                        <div class="customer-rate"><p>会员客户明细</p> </div>
                        <ul class="memberMess clearfix">
                            <li class="licilcle">全部<p ><b th:text="${vo.vipCustomerCount}"></b></p></li>
                            <li class="licilcle">本月新增
                                <p >
                                    <b
                                    th:text="${vo.monthNewVipCustomerCount}"
                                    ></b>/
                                    <span th:text="${vo.vipCustomerCount}"
                                    ></span>
                                </p>
                            </li>
                            <li class="licilcle">本月续费会员
                                <p >
                                    <b
                                    th:text="${vo.monthKeepVipCustomerCount}"
                                    ></b>/
                                    <span th:text="${vo.vipCustomerCount}"
                                    ></span>
                                </p>
                            </li>
                            <li class="licilcle">30天到期
                                <p >
                                    <b
                                    th:text="${vo.monthEndVipCustomerCount}"
                                    ></b>/
                                    <span th:text="${vo.vipCustomerCount}"
                                    ></span>
                                </p>
                            </li>
                            <li class="licilcle">本周到期
                                <p >
                                    <b
                                    th:text="${vo.weekEndVipCustomerCount}"
                                    ></b>/
                                    <span th:text="${vo.vipCustomerCount}"
                                    ></span>
                                </p>
                            </li>
                            <li class="licilcle">
                                <select class="form-control" id="customerId" name="customerId" type="text" title="请选择" >
                                    <option value="">请选择</option>
                                    <option value="1">v1</option>
                                    <option value="2">v2</option>
                                    <option value="3">v3</option>
                                    <option value="4">v4</option>
                                    <option value="5">v5</option>
                                    <option value="6">v6</option>
                                    <option value="7">v7</option>
                                    <option value="8">v8</option>
                                    <option value="9">v9</option>
                                    <option value="10">v10</option>
                                    <option value="11">v11</option>
                                </select>
                            </li>
                        </ul>
                        <div class="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12 analy-entire-small" style="border: none;margin-top: 0;padding-top: 0;box-shadow:none;">
                            <table id="memberTable"></table>
                        </div>

                    </div>

<!--                    <ul class="memberMess clearfix">-->
<!--                        <li>全部：<span th:text="${vo.vipCustomerCount}">111</span></li>-->
<!--                        <li>本月新增：<span th:text="${vo.monthNewVipCustomerCount+' / '+vo.vipCustomerCount}"></span></li>-->
<!--                        <li>本月续费会员：<span th:text="${vo.monthKeepVipCustomerCount+' / '+vo.vipCustomerCount}"></span></li>-->
<!--                        <li>30天到期：<span th:text="${vo.monthEndVipCustomerCount+' / '+vo.vipCustomerCount}"></span></li>-->
<!--                        <li>本周到期：<span th:text="${vo.weekEndVipCustomerCount+' / '+vo.vipCustomerCount}"></span></li>-->
<!--                        <li>-->
<!--                            <select class="form-control" id="customerId" name="customerId" type="text" title="请选择" >-->
<!--                                <option value="">请选择</option>-->
<!--                                <option value="1">v1</option>-->
<!--                                <option value="2">v2</option>-->
<!--                                <option value="3">v3</option>-->
<!--                                <option value="4">v4</option>-->
<!--                                <option value="5">v5</option>-->
<!--                                <option value="6">v6</option>-->
<!--                                <option value="7">v7</option>-->
<!--                                <option value="8">v8</option>-->
<!--                                <option value="9">v9</option>-->
<!--                                <option value="10">v10</option>-->
<!--                                <option value="11">v11</option>-->
<!--                            </select>-->
<!--                        </li>-->
<!--                    </ul>-->
<!--                    <table id="memberTable"></table>-->
                </div>
            </div>
        </div>
    </div>

</div>
</body>
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/js/perfect-scrollbar.min.js"></script>
<!--标签插件-->
<script src="/js/jquery-tags-input/jquery.tagsinput.min.js"></script>
<script type="text/javascript" src="/js/main.min.js"></script>
<script type="text/javascript" src="/js/bootstrap-table/bootstrap-table.min.js"></script>
<script type="text/javascript" src="/js/bootstrap-table/bootstrap-table-zh-CN.min.js"></script>
<script type="text/javascript" src="/js/popper.min.js"></script>
<script type="text/javascript" src="/js/jquery.cookie.min.js"></script>
<!--时间选择插件-->
<script src="/js/bootstrap-datetimepicker/moment.min.js"></script>
<script src="/js/jquery-confirm/jquery-confirm.min.js"></script>
<script src="/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.js"></script>
<script src="/js/bootstrap-datetimepicker/locale/zh-cn.js"></script>
<!--日期选择插件-->
<script src="/js/bootstrap-datepicker/bootstrap-datepicker.min.js"></script>
<script src="/js/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js"></script>
<!-- 多选框下拉 -->
<script type="text/javascript" src="/js/bootstrap-select.js"></script>
<script type="text/javascript" src="/js/bootstrap.lyear.dropdowntree.min.js"></script>
<!--table固定列-->
<script type="text/javascript" src="/js/bootstrap-table/extensions/fixed-columns/bootstrap-table-fixed-columns.js"></script>
<!-- 图表 -->
<script type="text/javascript" src="/js/echarts.min.js"></script>
<script type="text/javascript" src="/js/crm/customerManager/user/vipCustomerAnalyse.js"></script>
</html>